
<section>
    <h2>Reporte de Tutores </h2>
</section>


<form name="filtro" method="post" id="filtro" >
                <input type="hidden"  value="<? echo $id_departamento;?>" name="id_departamento">
            <p align="center">         

                    <label for="start" >Fecha  de inicio de plan: del</label>
                    <input id="start" name="start" style="width: 200px" tabindex="1"/>

                    <label for="end">al</label>
                    <input id="end" name="end" style="width: 200px" tabindex="4"/>                    

                    
            </p>                
            <p align="center">


 
                   <label for="start1" >Fecha de Finalizacion del plan: del</label>
                    <input id="start1" name="start1" style="width: 200px" tabindex="1"/>


                    <label for="end1">al</label>
                    <input id="end1" name="end1" style="width: 200px" tabindex="4"/>                    

                    

            </p>
            <p>
                    <label for="id_tutor" id="lid_fuente_fondo">Tutor</label>
                    <select class="select" style="width:300px;" tabindex="2" id="id_tutor" name="id_tutor" multiple="multiple">
                                <option value="0" seleted="selected">Todos</option>';
                    <?php     
                        foreach($tutores as $val) 
                        {             
                                  echo' <option value="'.$val['id_tutor'].'">'.ucwords($val['nombrec']).'</option>';
                    
                        } 
                    ?>
                                                                
                    </select>


                    <label for="year" id="lservicio_de">Estado de Plan</label>               
                    <select class="select" style="width:300px;" tabindex="4" id="estado" name="estado" >
                            <?php
                                $i=0;
                                foreach($years as $val) {
                                echo '
                                    <option value="'.$i.'">'.$val.'</option>';
                                $i++;
                                }
                            ?>
                           
                    </select>               

            </p>
            <p align="center">
                <button  id="imp1" class="button tam-1 requerido" formaction="<? echo base_url()?>index.php/social/planes_turores_impreso">Imprimir</button>
                <button type="button" id="Filtrar" class="button tam-1" >Filtrar</button>                    
                    

            </p>

</form>



<table cellspacing='0' align='center' class='table_design' id="datos"  >
            <thead>
             <th width="70px">
                   N° plan
            </th>
               <th>
                    Proyecto
                </th>
                <th width="200px">
                   Tutor
                </th>
               <th width="90px">
                   Periodo
                </th>

            </thead>
            <tbody>
            </tbody>
        </table>


    <!----------------------------------------------------------------------------------------------------------------- -->




<h2>Total </h2>
<table cellspacing='0' align='center' class='table_design' id="total"  >
            <thead>
             <th width="350px">
                Tutor
            </th>
            <th width="100px">
                Cantidad de Planes
                </th>

            </thead>
            <tbody>
            </tbody>
        </table>







<script type="text/javascript">

///---------------------funciones para filtrar los datos 
     $("#Filtrar").click(function(){             

            var formu = $('#filtro').serializeArray();
        //    console.log(formu); 

        reporte(formu);
        });

var datos;
    function reporte(formu){  
         $(document.body).css({ 'cursor': 'wait' })
                $.ajax({
            async:  true, 
            url:    base_url()+"index.php/social/planes_tutores_json",
            dataType:"json",
             type: "POST",
            data: formu,
            success: function(data){
               tabla(data) 
               if(data.length==0){
                    alertify.alert('No se tuvieron resultados');
               }

                },
            error:function(data){

                

                 alertify.alert('Error al cargar datos');
          console.log(data);
                }
        });          

//Segundo ajax con totales
                $.ajax({
            async:  true, 
            url:    base_url()+"index.php/social/planes_tutores_c_json",
            dataType:"json",
             type: "POST",
            data: formu,
            success: function(data){
               tablac(data) 


                },
            error:function(data){                

                 alertify.alert('Error al cargar totales');
          console.log(data);
                }
        });          
        $(document.body).css({ 'cursor': 'default' })
    }

function tabla (json) {
                var fila;

            $('#datos tbody').remove();        
            for (i=0;i<json.length;i++) {  
             fila= "<tr>" +
              "<td align='center'>" + json[i].numero + "</td>" +
              "<td align='center'>" + json[i].proyecto + "</td>" +
              "<td align='center'>" + json[i].tutor + "</td>" +
              "<td align='center'>" + json[i].inicio + " <br>"+ json[i].fin + "</td>" +
            "</tr>";    
                $('#datos').append(fila)    
                }  
}
function tablac (json) {
                var fila;

            $('#total tbody').remove();        
            for (i=0;i<json.length;i++) {  
                 fila= "<tr>" +
                  "<td align='center'>" + json[i].tutor + "</td>" +
                  "<td align='center'>" + json[i].cant +  "</td>" +
                "</tr>";    
                    $('#total').append(fila)    
            }  
}
//-----------------------------------------Funciones    para las fechas
 

                 function startChange1() {
                        var startDate = start1.value(),
                        endDate = end1.value();

                        if (startDate) {
                            startDate = new Date(startDate);
                            startDate.setDate(startDate.getDate());
                            end1.min(startDate);
                        } else if (endDate) {
                            start1.max(new Date(endDate));
                        } else {
                            endDate = new Date();
                            start1.max(endDate);
                            end1.min(endDate);
                        }
                    }

                    function endChange1() {
                        var endDate = end1.value(),
                        startDate = start1.value();

                        if (endDate) {
                            endDate = new Date(endDate);
                            endDate.setDate(endDate.getDate());
                            start1.max(endDate);
                        } else if (startDate) {
                            end1.min(new Date(startDate));
                        } else {
                            endDate = new Date();
                            start1.max(endDate);
                            end1.min(endDate);
                        }
                    }

                    var start1 = $("#start1").kendoDatePicker({
                        change: startChange1,
                         format: "dd-MM-yyyy" 
                    }).data("kendoDatePicker");

                    var end1 = $("#end1").kendoDatePicker({
                        change: endChange1,
                         format: "dd-MM-yyyy" 
                    }).data("kendoDatePicker");

                    start1.max(end1.value());
                    end1.min(start1.value());




                 function startChange() {
                        var startDate = start.value(),
                        endDate = end.value();

                        if (startDate) {
                            startDate = new Date(startDate);
                            startDate.setDate(startDate.getDate());
                            end.min(startDate);
                        } else if (endDate) {
                            start.max(new Date(endDate));
                        } else {
                            endDate = new Date();
                            start.max(endDate);
                            end.min(endDate);
                        }
                    }

                    function endChange() {
                        var endDate = end.value(),
                        startDate = start.value();

                        if (endDate) {
                            endDate = new Date(endDate);
                            endDate.setDate(endDate.getDate());
                            start.max(endDate);
                        } else if (startDate) {
                            end.min(new Date(startDate));
                        } else {
                            endDate = new Date();
                            start.max(endDate);
                            end.min(endDate);
                        }
                    }

                    var start = $("#start").kendoDatePicker({
                        change: startChange,
                         format: "dd-MM-yyyy" 
                    }).data("kendoDatePicker");

                    var end = $("#end").kendoDatePicker({
                        change: endChange,
                         format: "dd-MM-yyyy" 
                    }).data("kendoDatePicker");

                    start.max(end.value());
                    end.min(start.value());


</script>